<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
	<script type="text/javascript" src="<%=path%>/static/js/jquery-3.2.1.js"></script>
 	<script src="<%=path%>/static/js/highcharts.js"></script>
 	<script src="<%=path%>/static/js/data.js"></script>
 	<script src="<%=path%>/static/js/exporting.js"></script>
 	<script src="<%=path%>/static/js/highcharts-zh_CN.js"></script>
 	<script src="<%=path%>/static/js/oldie.js"></script>
 	<script src="<%=path%>/static/js/series-label.js"></script>
</head>
<body>
<div id="container" style="min-width:400px;height:400px"></div>
<div class="message"></div>
</body>
<script type="text/javascript">
var chart = Highcharts.chart('container', {
	title: {
		text: '2019 年晋中市某垃圾排放回收统计'
	},
	subtitle: {
		text: '数据来源：ChaFenLei.com'
	},
	yAxis: {
		title: {
			text: '垃圾总量/吨'
		}
	},
	legend: {
		layout: 'vertical',
		align: 'right',
		verticalAlign: 'middle'
	},
	plotOptions: {
		series: {
			label: {
				connectorAllowed: false
			},
			
		}
	},
	xAxis: {
		categories: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
	},
	series: [{
		name: '排放量',
		data: [200,100,120,60,0,0,0,0,0,0,0,0]
	}, 
	{
		name: '回收量',
		data: [160, 78, 82, 110, 0,0,0,0,0,0,0,0]
	}
	],
	responsive: {
		rules: [{
			condition: {
				maxWidth: 100
			},
			chartOptions: {
				legend: {
					layout: 'horizontal',
					align: 'center',
					verticalAlign: 'bottom'
				}
			}
		}]
	}
});
</script>
</html>